<!-- 在屏幕宽度小于500px时作用这个样式、 -->
<link rel="stylesheet" media="screen and (max-width:500px)" href="style.css" />

<!-- 第二种css样式引入方法 -->
<style>
	@import 'style.css' screen and (max-width: 500px);

	/* css样式引入、媒体查询不占用权重 (所以一般写在css后面) */
	/* and ----- 且
       ,  ----- 或
       not ----- 非
	*/
	@media not screen, (max-width: 500px) and (min-width: 300px) {
		body {
			background: red;
		}
	}
</style>
